<template>
  <view class="container">
    <view class="example">
     <uni-forms ref="form" :model="formData" labelWidth="14%">
		  <uni-forms-item label="姓名" name="mname" required>
			<span style="line-height: 35px">{{ formData.mname}}</span>
		  </uni-forms-item>
		  <uni-forms-item label="日期" name="date" required>
			<uni-datetime-picker 
			type="date" 
			:clear-icon="false" 
			v-model="formData.date" 
			@change="dateChange"/>
		  </uni-forms-item>
		  <uni-forms-item label="上午" name="morning">
			<uni-easyinput type="textarea" autoHeight v-model="formData.morning" placeholder="请输入工作行程"></uni-easyinput>
		  </uni-forms-item>
		  <uni-forms-item label="下午" name="afternoon">
			<uni-easyinput type="textarea" autoHeight v-model="formData.afternoon" placeholder="请输入工作行程"></uni-easyinput>
		  </uni-forms-item>
		  <uni-forms-item label="全天" name="allday">
			<uni-easyinput type="textarea" autoHeight v-model="formData.allday" placeholder="请输入工作行程;注意:若有输入当天行程,上午及下午行程内容将自动作废"></uni-easyinput>
		  </uni-forms-item>
		  
     </uni-forms>
      <button class="button-blue" style="position: fixed;bottom: 0;" @click="save()">保存</button>
    </view>
  </view>
</template>

<script>
  import { checkPermi } from "@/utils/permission";
  import { arrangeApi } from '@/api/module';
  import { Debounce } from '@/utils/common';

  export default {
    data() {
      return {
	   //表单
	   formData: {
	   },
		//表单规则判断
        rules: {
		  date: {
		    rules: [{
			  required: true,
			  errorMessage: '请选择日期'
		    }]
		  }
        },
      }
    },
    async onLoad(option) {
		if(option.formData){
			let covertData = JSON.parse(option.formData)
			this.formData = {...covertData};
		}
		
    },
    onReady() {
      this.$refs.form.setRules(this.rules)
    },
    methods: {
		dateChange(val){
			if(val){
				//查询数据
				uni.showLoading();
				let mname = this.formData.mname;
				let userId = this.formData.userId;
				let morning = this.formData.morning;
				let afternoon = this.formData.afternoon;
				let allday = this.formData.allday;
				let id = this.formData.id;
				let search = new Object();
				search.date = val;
				search.userId = this.formData.userId;
				arrangeApi.listArrange(search).then(response =>{
					if(response.rows.length > 0){
						this.formData = response.rows[0].children[0];
					}else{
						this.formData = {};
						this.formData.add = true;
						this.formData.mname = mname;
						this.formData.userId = userId;
						this.formData.date = search.date;
						
						if(!id){
							this.formData.morning = morning;
							this.formData.afternoon = afternoon;
							this.formData.allday = allday;
						}
						
						this.formData.weeks = this.getWeeks(val);
					}
					uni.hideLoading();
				});
			}else{
				this.formData.weeks = null;
			}
		},
	  //权限
	  checkPermi,
	  save:Debounce(async function(){
		  await this.$refs.form.validate().then(async res=>{
			  let that = this;
			  uni.showLoading();
			  this.formData.createTime = null;
			  this.formData.updateTime = null;
			  this.formData.weeks = this.getWeeks(this.formData.date);
			  await arrangeApi.saveArrange(this.formData).then(async data => {
				  uni.hideLoading();
				  this.$modal.msgSuccess('操作成功');
				  await setTimeout(async function(){
					  that.$tab.navigateTo('/pages/module/arrange/list');
				  },350)
				  
			  })
		  })
	  }),
	  
	  getWeeks(val){
	  	var year = val.substr(0,4);
	  	var month = val.substr(5,2);
	  	var day = val.substr(8,2);
	  	let weeks = this.getYearWeeks(year,month,day);
	  	return weeks;
	  },
	  
    }
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }

  .example {
    padding: 15px;
    background-color: #fff;
  }

  .segmented-control {
    margin-bottom: 15px;
  }

  .button-group {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
  }

  .form-item {
    display: flex;
    align-items: center;
    flex: 1;
  }

  .button {
    display: flex;
    align-items: center;
    height: 35px;
    line-height: 35px;
    margin-left: 10px;
  }
</style>
